<template>
    <div class="common-layout">
        <el-container>
            <el-aside width="200px">
                <el-menu default-active="2" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose">
                    <el-sub-menu index="1">
                        <template #title>
                            <el-icon>
                                <Menu/>
                            </el-icon>
                            <span>员工模块</span>
                        </template>
                        <el-menu-item index="1-1" @click="toUserAttend">考勤签到</el-menu-item>
                        <el-menu-item index="1-2" @click="toUserLeave">请假申请</el-menu-item>
                        <el-menu-item index="1-3" @click="toUserResign">离职申请</el-menu-item>
                        <el-menu-item index="1-4" @click="toUserCenter">个人中心</el-menu-item>
                    </el-sub-menu>
                    <el-sub-menu index="2">
                        <template #title>
                            <el-icon>
                                <Menu />
                            </el-icon>
                            <span>活动模块</span>
                        </template>
                        <el-menu-item index="2-1" @click="toUserTraining">培训活动</el-menu-item>
                        <el-menu-item index="2-2" @click="toUserTeamBuilding">团建活动</el-menu-item>
                    </el-sub-menu>
                </el-menu>
            </el-aside>
            <el-main>
                <RouterView></RouterView>
            </el-main>
        </el-container>
    </div>
</template>

<script setup>
import {Menu } from '@element-plus/icons-vue';
import { useRouter, RouterView } from 'vue-router';
const router = useRouter();
function toUserCenter(){
    router.push('/userMenu/userMessage')
}  
function toUserAttend(){
    router.push('/userMenu/userAttend')
}
function toUserLeave(){
    router.push('/userMenu/userLeave')
}
function toUserResign(){
    router.push('/userMenu/userResign')
}
function toUserTraining(){
    router.push('/userMenu/userTraining')
}
function toUserTeamBuilding(){
    router.push('/userMenu/userTeamBuilding')
}
</script>

<style></style>